<!DOCTYPE html>
<title>SVGSVGElement.getCurrentTime() when animation is paused and unpaused</title>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<svg height="0">
  <rect fill="green" width="20" height="20">
    <animate attributeName="x" from="0" to="200" begin="0s" dur="3s"/>
  </rect>
</svg>
<script>
// Assume that current time is aligned to at least 60hz, and thus within
// half of a frame time.
const errorInSeconds = (1 / 60) / 2;

async_test(t => {
  window.onload = t.step_func(() => {
    let svg = document.querySelector("svg");
    // Pause the animation.
    svg.pauseAnimations();
    assert_equals(svg.getCurrentTime(), 0, 'initial');

    let currentTimeAfterDelay = 0;
    // 10ms delay.
    t.step_timeout(t.step_func(() => {
      // Current time should still be 0.
      assert_equals(svg.getCurrentTime(), 0, 'after 10ms paused');
      // Resume the animation.
      svg.unpauseAnimations();

      // 50ms delay.
      t.step_timeout(t.step_func(() => {
        // Current time should've advanced close to 50ms (may not be
        // exact because the clock is synchronized to rAF.)
        currentTimeAfterDelay = svg.getCurrentTime();
        assert_greater_than_equal(currentTimeAfterDelay, 0.05 - errorInSeconds, 'after 50ms unpaused');
        // Pause the animation.
        svg.pauseAnimations();

        // 50ms delay.
        t.step_timeout(t.step_func_done(() => {
          // Current time should not have advanced.
          assert_equals(svg.getCurrentTime(), currentTimeAfterDelay, 'after 50ms paused');
        }), 50);
      }), 60);
    }), 10);
  });
});
</script>
